<template>
	<tui-tabbar :current="current" :tabBar="tabBar" selectedColor="#e41f19" @click="tabClick"></tui-tabbar>
</template>

<script>
	const home = {
					"pagePath": "/pages/mall/mall",
					"name": "home",
					"text": "首页",
					"iconPath": "../../../static/images/tabbar/home_gray.png",
					"selectedIconPath": "../../../static/images/tabbar/home_active.png"
				}
	const category = {
					"pagePath": "/pages/classify/classify",
					"name": "category",
					"text": "商品分类",
					"iconPath": "../../../static/images/tabbar/cate_gary.png",
					"selectedIconPath": "../../../static/images/tabbar/cate_active.png"
				}
	const cart = {
					"pagePath": "/pages/shopcart/shopcart",
					"name": "cart",
					"text": "购物车",
					"iconPath": "../../../static/images/tabbar/cart_gray.png",
					"selectedIconPath": "../../../static/images/tabbar/cart_active.png"
				}
	const proxy = {
					"pagePath": "/pages/proxy/home/home",
					"name": "proxy",
					"text": "代理",
					"iconPath": "../../../static/images/tabbar/icon-proxy.png",
					"selectedIconPath": "../../../static/images/tabbar/icon-proxy-selected.png"
				}
	const my = {
				"pagePath": "/pages/my/my",
				"name": "my",
				"text": "我的",
				"iconPath": "../../../static/images/tabbar/my_gray.png",
				"selectedIconPath": "../../../static/images/tabbar/my_active.png"
			}
	export default {
		props: {
			name: {
				type: String,
				default: 'home'
			},
			role: {
				type: Number,
				default: 1
			}
		},
		data() {
			return {};
		},
		computed: {
			tabBar() {
				const { USER } = this.$store.state
				return Number(USER.role) === 2 ? 
					[home, category, cart, proxy, my] :
					[home, category, cart, my];
			},
			current() {
				return Math.max(this.tabBar.findIndex(d => d.name === this.name), 0)
			}
		},
		methods: {
			tabClick(item) {
				// console.log(item.index, this.current, 'ss')
				if (item.index !== this.current) {
					uni.switchTab({
						url: item.pagePath,
						fail(err) {
							console.error(err, '切换tab页失败')
						}
					})
				}
			}
		}
	}
</script>

<style lang="scss">

</style>
